 <!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title> 事件和mvc的关系 </title>
		<script src="../js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/Underscore-1.8.3min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/backbone.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/data.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<div id="view">
			<button id="showBtn">显示</button>
			<button id="hideBtn">隐藏</button>
		</div>
		<div id="info">
			<div>名称：小狗</div>
			<div>颜色：黄色</div>
			<div>体重：3kg</div>
		</div>
		<script type="text/javascript">
		//在view中定义事件
			 var infoView=Backbone.View.extend({
			 	el:"#view",
			 	events:{
			 		'click #showBtn':'showInfo',
			 		'click #hideBtn':'hideInfo'
			 	},
			 	showInfo:function(){
			 		$("#info").show();
			 	},
			 	hideInfo:function(){
			 		$("#info").hide();
			 	}
			 });
			 var newView=new infoView;
		</script>
	</body>
</html>